<template>
  <div class="container">
    <router-view></router-view>
    <div class="index">
      <Header />
      <div class="main-center ">
        <div class="main-left ">
          <div class="t-title bor-b6">回收站</div>
          <div class="con2">
            <div class="clear"></div>
            <ul class="act-area" style="height:40px;">
              <span class="tip" v-if="checkedIds.length == 0">您删除的项目或文件夹将在此保留30天，然后将被永久删除</span>
              <template v-else>
                <span class="huifu" @click="recovery()">恢复</span>
                <span class="quxiao" @click="checkedIds = []">取消</span>
              </template>

              <span class="fr clearall" @click="clearAll()">一键清空</span>
            </ul>
            <div class="mt30"></div>
            <el-checkbox-group v-model="checkedIds">
              <ul class="reslist" v-if="listData.length > 0">
                <template v-for="(item, i) in listData">
                  <li>
                    <span class="chk fl"><el-checkbox :key="item.id" :label="item.id">&nbsp;</el-checkbox></span>
                    <label class="file">{{ item.title }}</label>
                    <label class="date">{{ item.createtime_text }}</label>
                  </li>
                </template>
              </ul>
            </el-checkbox-group>
          </div>
        </div>
        <div class="main-right ">
          <div class="con-menu2" @click="goBack()">
            <div class="menu-img"><img src="static/img/r-back.png" alt="" /></div>
            <div class="menu-item">返回</div>
          </div>
          <div class="con-menu2" @click="goHome()">
            <div class="menu-img"><img src="static/img/r-home.png" alt="" /></div>
            <div class="menu-item">首页</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import Header from '../components/header.vue';
export default {
  data() {
    return {
      isTip: true,
      input: '',
      isList: false,
      listData: [],
      checkedIds: [],
      total: 0,
      page: 1,
      page_size: 12,
      current: -1,
      categoryId: '',
      currentPage: 1,
      cid: 0
    };
  },
  created() {
    this.handleCurrentChange(1);
  },
  methods: {
    getCatList(order_type, index, page = 1, keyword, del = 0) {
      if (page == 1) {
        this.currentPage = 1;
      } else if (page == this.total) {
        this.currentPage = this.total;
      }
      this.page = page;
      this.order_type = order_type;
      this.current = index;
      this.keyword = keyword;

      let all_form = {
        order_type: this.order_type,
        page: this.page,
        limit: this.page_size,
        del: del,
        search: this.keyword
      };
      this.$api('resources.dellist', all_form).then(res => {
        this.listData = res.data.data;
        this.total = res.data.last_page;
      });
    },
    handleCurrentChange(page) {
      this.currentPage = page;
      this.getCatList(this.order_type, this.current, page, this.keyword, 0);
    },
    goBack() {
      this.$router.go(-1);
    },
    goHome() {
		  this.$router.push(localStorage.getItem('jump_path'));
      //this.$router.push('/index');
    },
    goProfile() {
      this.$router.push('/profile');
    },
    recovery() {
      this.$api('resources.delback', { ids: this.checkedIds.join(',') }).then(res => {
        this.checkedIds = [];
        this.handleCurrentChange(1);
        this.$message.success(res.msg);
      });
    },
    clearAll() {
      if (this.listData.length == 0) {
        this.$message.error('暂无内容');
        return;
      }
      this.$confirm('确定要一键清空吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          this.$api('resources.delall', {}).then(res => {
            this.handleCurrentChange(1);
            this.$message.success(res.msg);
          });
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消'
          });
        });
    }
  },
  components: { Header }
};
</script>

<style lang="scss" scoped></style>
